﻿$(function() {
	var delParent;
	var defaults = {
		fileType: ["jpg", "png", "bmp", "jpeg"],
		fileSize: 1024 * 1024 * 10
	};
	$('.upload-box').each(function(){
		var imgContainer = $(this).find('.upload-dragger');
		var imgfile = $(this).data('imgfile');
		if(imgfile){
			var html = '<img src="'+imgfile+'" class="single_img">';
			html += '<div class="upload-list__picture-card" style="position: absolute;"><span class="upload-list__item-actions"><span class="upload-list__item-preview"><i class="iconfontzz icon-zoomin"></i></span> <span class="upload-list__item-delete"><i class="iconfontzz icon-remove">&#xe600;</i></span> <div class="upload-list__item-change">点击替换</div></span></div>';
		}else{
			var html = '<div class="simpleupload-first"><i class="icon iconfontzz">&#xe644;</i><p>点击上传，或将文件拖拽到此处</p></div>';
		}
		imgContainer.html(html);
	});
	$('.upload-box').on('change', '.simpleupload-file', function(){
		var idFile = $(this).attr("id");
		var file = document.getElementById(idFile);
		var parentObj = $(this).parent();
		var imgContainer = parentObj.find('.upload-dragger');
		var oneFile = this.files[0];
		var imgUrl = window.URL.createObjectURL(oneFile);
		var html = '<img src="'+imgUrl+'" class="single_img">';
		html += '<div class="upload-list__picture-card" style="position: absolute;"><span class="upload-list__item-actions"><span class="upload-list__item-preview"><i class="iconfontzz icon-zoomin"></i></span> <span class="upload-list__item-delete"><i class="iconfontzz icon-remove">&#xe600;</i></span> <div class="upload-list__item-change">点击替换</div></span></div>';
		imgContainer.html(html);
		parentObj.find('.simpleupload-first').hide();
		//$('.simpleupload-first').css('opacity', 0);
		//$(this).val("");
		parentObj.find('.simpleupload-delfile').val(0);
	});
	$('.upload-box').on('click', '.simpleupload-first', function(){
		$(this).parent().next(".simpleupload-file").click();
	})
	$('.upload-box').on('click', '.upload-list__item-change', function(){
		var parentObj = $(this).parents('div.upload-box');
		parentObj.find(".simpleupload-file").click();
	})
	//查看图片
	$('.upload-box').on('click', '.upload-list__item-preview', function(){
		var parentObj = $(this).parents('div.upload-box');
		var imgContainer = parentObj.find('.upload-dragger');
		var imgUrl = imgContainer.find('img.single_img').attr('src');
		layer.open({
			type: 1,
			skin: 'layui-layer-rim', //加上边框
			area: ['600px'], //宽高
			maxHeight: '100%',
			shadeClose: true,
			title: '查看图片',
			content: '<img src="'+imgUrl+'" style="width:100%" />'
		});
	})
	//删除图片
	$('.upload-box').on('click', '.upload-list__item-delete', function(){
		var parentObj = $(this).parents('div.upload-box');
		var imgContainer = parentObj.find('.upload-dragger');
		var html = '<div class="simpleupload-first"><i class="icon iconfontzz">&#xe644;</i><p>点击上传，或将文件拖拽到此处</p></div>';
		imgContainer.html(html);
		parentObj.find('.simpleupload-delfile').val(1);
	})

	function validateUp(files) {
		var arrFiles = [];
		for (var i = 0, file; file = files[i]; i++) {
			var newStr = file.name.split("").reverse().join("");
			if (newStr.split(".")[0] != null) {
				var type = newStr.split(".")[0].split("").reverse().join("");
				console.log(type + "===type===");
				if (jQuery.inArray(type, defaults.fileType) > -1) {
					if (file.size >= defaults.fileSize) {
						alert(file.size);
						alert('您这个"' + file.name + '"文件大小过大');
					} else {
						arrFiles.push(file);
					}
				} else {
					alert('您这个"' + file.name + '"上传类型不符合');
				}
			} else {
				alert('您这个"' + file.name + '"没有类型, 无法识别');
			}
		}
		return arrFiles;
	}
})